<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/view/include/taglib.jsp"%>
<html lang="cn" class="app">
<head>
    <title>后台管理 - 模板</title>
    <meta name="description" content="app, web app, responsive, admin dashboard, admin, flat, flat ui, ui kit, off screen nav" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
    <link rel="icon" type="image/png" href="icon.png">
    <link rel="apple-touch-icon-precomposed" href="icon.png">
    <link rel="stylesheet" href="${ctxStatic}/js/jPlayer/jplayer.flat.css" type="text/css" />
    <link rel="stylesheet" href="${ctxStatic}/css/bootstrap.css" type="text/css" />
    <link rel="stylesheet" href="${ctxStatic}/css/animate.css" type="text/css" />
    <link rel="stylesheet" href="${ctxStatic}/css/font-awesome.min.css" type="text/css" />
    <link rel="stylesheet" href="${ctxStatic}/css/simple-line-icons.css" type="text/css" />
    <link rel="stylesheet" href="${ctxStatic}/css/font.css" type="text/css" />
    <link rel="stylesheet" href="${ctxStatic}/css/app.css" type="text/css" />
    <link rel="stylesheet" href="${ctxStatic}/js/chosen/chosen.css" type="text/css" />
    <link rel="stylesheet" href="${ctxStatic}/js/ztree/css/zTreeStyle.css" />
    <!--[if lt IE 9]>
    <script src="${ctxStatic}/js/ie/html5shiv.js"></script>
    <script src="${ctxStatic}/js/ie/respond.min.js"></script>
    <script src="${ctxStatic}/js/ie/excanvas.js"></script>
    <![endif]-->
</head>

<body>
    <section class="scrollable wrapper">
        <div class="row">
            <div class="col-lg-12">
                <!-- 引导开始 -->
                <ul class="breadcrumb">
                    <li><a href="${ctx}/welcome"><i class="fa fa-home"></i> 主页</a></li>
                    <li>代码生成</li>
                    <li class="active">执行生成</li>
                </ul>
                <!-- 引导结束 -->
            </div>
        </div>
    </section>
    <form class="bs-example form-horizontal" method="post" action="${ctx}/code/codeTemplate/create" >
        <%--参数配置 开始--%>
        <div class="col-lg-12">
            <section class="panel panel-default">
                <header class="panel-heading font-bold">参数配置</header>

                <div class="panel-body">
                    <div class="form-group col-lg-6">
                        <label class="col-lg-4 col-md-4 col-sm-4 control-label">输出路径：</label>
                        <div class="col-lg-6 col-md-6 col-sm-6">
                            <input id="outPath" type="text" class="form-control" placeholder="输出路径" required>
                        </div>
                    </div>
                    <div class="form-group col-lg-6">
                        <label class="col-lg-4 col-md-4 col-sm-4 control-label">作者：</label>
                        <div class="col-lg-6 col-md-6 col-sm-6">
                            <input id="author" type="text" class="form-control" placeholder="作者" required>
                        </div>
                    </div>
                </div>
            </section>
        </div>
        <%--参数配置 结束--%>


        <%--数据库列表 开始--%>
        <div class="col-lg-3 col-md-4 col-sm-4 col-xs-12">
            <section class="panel panel-default ">
                <header class="panel-heading font-bold">资源池</header>
                <div class="panel-body">
                    <div class="form-group col-lg-12">
                        <select id="poolId" style="width:200px;margin-top:10px;" class="chosen-select" placeholder="请选择资源池" required>
                            <option value="">请选择资源池</option>
                            <c:forEach items="${codePoollist}" var="pool">
                                <option value="${pool.id}">${pool.name}</option>
                            </c:forEach>
                        </select>
                    </div>
                    <div class="form-group col-lg-12" style="min-height:300px;">
                        <style>.line{height:auto;}</style><%--这个不能删除--%>
                        <ul id="treePool" class="ztree" style="max-height:300px;overflow-y: auto"></ul><!-- 资源树 -->
                        节点ID:<input type="text" id="chosenTableId" class="form-control" style="border: 0px;" readonly/>
                        节点Nm:<input type="text" id="chosenTableNm" class="form-control" style="border: 0px;" readonly/>
                        资源池ID:<input type="text" id="chosenPoolId" class="form-control" style="border: 0px;" readonly/>
                    </div>
                </div>
            </section>
        </div>
        <%--数据库列表 结束--%>

        <%--模板列表 开始--%>
        <div class="col-lg-3 col-md-4 col-sm-4 col-xs-12">
            <section class="panel panel-default">
                <header class="panel-heading font-bold">模板</header>
                <div class="panel-body">
                    <div class="form-group col-lg-12">
                        <select id="projectId" style="width:200px;margin-top:10px;" class="chosen-select">
                            <option value="">请选择项目</option>
                            <c:forEach items="${codeProjectlist}" var="project">
                                <option value="${project.id}">${project.name}</option>
                            </c:forEach>
                        </select>
                    </div>
                    <div class="form-group col-lg-12" style="min-height:300px;">
                        <style>.line{height:auto;}</style><%--这个不能删除--%>
                        <ul id="tree" class="ztree" style="max-height:300px;overflow-y: auto"></ul><!-- 资源树 -->
                        节点ID:<input type="text" id="chosenTreeValue" class="form-control" style="border: 0px;" readonly/>
                        节点Nm:<input type="text" id="chosenTreeName" class="form-control" style="border: 0px;" readonly/>
                        项目ID:<input type="text" id="chosenProjectId" class="form-control" style="border: 0px;" readonly/>
                    </div>
                </div>
            </section>
        </div>
        <%--模板列表 结束--%>
        <%--操作 开始--%>
        <div class="col-lg-3 col-md-4 col-sm-4 col-xs-12">
            <section class="panel panel-default ">
                <header class="panel-heading font-bold">操作</header>
                <div class="panel-body">

                    <table class="table table-striped m-b-none">
                        <tbody>
                        <tr>
                            <td class="text-center" ><button class="btn btn-s-md btn-info" onclick="startAll()">生成全部模板</button></td>
                        </tr>
                        <tr>
                            <td class="text-center" ><button class="btn btn-s-md btn-info" onclick="startOne()">生成指定模板</button></td>
                        </tr>
                        </tbody>
                    </table>

                </div>
            </section>
        </div>
        <%--操作 结束--%>

        <%--结果 开始--%>
        <div class="col-lg-3 col-md-12 col-sm-12 col-xs-12">
            <section class="panel panel-default">
                <header class="panel-heading font-bold">结果</header>
                <div class="panel-body" style="min-height:100px;">

                </div>
            </section>
        </div>
        <%--结果 结束--%>

    </form>

</body>

<script src="${ctxStatic}/js/jquery.min.js"></script>
<!-- Bootstrap -->
<script src="${ctxStatic}/js/bootstrap.js"></script>
<!-- App -->
<script src="${ctxStatic}/js/app.js"></script>
<script src="${ctxStatic}/js/slimscroll/jquery.slimscroll.min.js"></script>
<script src="${ctxStatic}/js/app.plugin.js"></script>
<script type="text/javascript" src="${ctxStatic}/js/jPlayer/jquery.jplayer.min.js"></script>
<script type="text/javascript" src="${ctxStatic}/js/jPlayer/add-on/jplayer.playlist.min.js"></script>
<script type="text/javascript" src="${ctxStatic}/js/jPlayer/demo.js"></script>
<script type="text/javascript" src="${ctxStatic}/js/tools.js"></script>
<script type="text/javascript" src="${ctxStatic}/js/page/paging.js"></script>
<script type="text/javascript" src="${ctxStatic}/js/layer/layer.js"></script>
<script type="text/javascript" src="${ctxStatic}/js/tmpl/jquery.tmpl.js"></script>
<script type="text/javascript" src="${ctxStatic}/js/chosen/chosen.jquery.min.js"></script>
<script src="${ctxStatic}/js/ztree/js/jquery.ztree.core-3.5.min.js"></script>
<script>
    $(function(){
        /** 绑定项目选择事件 */
        $("#projectId").chosen().on("change", function (evt, params) {
            $("#chosenProjectId").val(params.selected);
            loadCatalog(params.selected);//加载目录
        });

        /** 绑定资源池选择事件 */
        $("#poolId").chosen().on("change", function (evt, params) {
            $("#chosenPoolId").val(params.selected);
            loadTables(params.selected);//加载数据库表
        });
    })

    /** 加载目录 */
    function loadCatalog(projectId){
        if(projectId==""){
            $("#tree").html("请先选择项目");
        }else{
            var loadingLayer = layer.load(1, {shade: [0.1,'#fff']});//loading
            //根据项目标识获取目录
            $.ajax({
                type: 'post',
                url: '${ctx}/code/codeCatalog/getCatalogAndTemplateList.json?timeStamp='+new Date().getTime(),
                dataType:"json",
                data: {"projectId":projectId},
                success: function (data) {
                    layer.close(loadingLayer);
                    var catalogList = data.data.codeCatalogList;
                    var templateList = data.data.codeTemplateList;
                    var setting = {
                        view: {
                            dblClickExpand: false
                        },
                        check: {
                            enable: true
                        },
                        data: {
                            simpleData: {
                                enable: true
                            }
                        },
                        callback : {
                            onClick : function(event, treeId, treeNode) {
                                $("#chosenTreeValue").val(treeNode.id);
                                $("#chosenTreeName").val(treeNode.name);
                            }
                        }
                    };
                    var zNodesHtml = "";
                    for(var i=0;i<catalogList.length;i++){
                        zNodesHtml += ",{id:'"+catalogList[i].id+"', pId: '"+catalogList[i].parentId+"', name: '"+catalogList[i].name+"', open:1,icon:'${ctxStatic}/js/ztree/img/file.png'}";
                    }
                    for(var i=0;i<templateList.length;i++){
                        zNodesHtml += ",{id:'T"+templateList[i].id+"', pId: '"+templateList[i].catalog+"', name: '"+templateList[i].name+"', open:1}";
                    }

                    if(zNodesHtml.startsWith(",")){
                        zNodesHtml = zNodesHtml.substr(1,zNodesHtml.length);
                    }

                    zNodesHtml = "[" + zNodesHtml + "]";

                    var zNodes = eval(zNodesHtml);

                    var ztree = $.fn.zTree.init($("#tree"), setting, zNodes);
                    ztree.expandAll(true);
                },error:function(){
                    layer.close(loadingLayer);
                    alert("程序异常");
                }
            });
        }
    }

    /**加载数据库表*/
    function loadTables(poolId){
        if(poolId==""){
            $("#treePool").html("请先选择资源池");
        }else{
            var loadingLayer = layer.load(1, {shade: [0.1,'#fff']});//loading
            //根据项目标识获取目录
            $.ajax({
                type: 'post',
                url: '${ctx}/code/codePool/getTableList.json?timeStamp='+new Date().getTime(),
                dataType:"json",
                data: {"poolId":poolId},
                success: function (data) {
                    layer.close(loadingLayer);
                    var treeList = data.data;
                    var setting = {
                        view: {
                            dblClickExpand: false
                        },
                        check: {
                            enable: true
                        },
                        data: {
                            simpleData: {
                                enable: true
                            }
                        },
                        callback : {
                            onClick : function(event, treeId, treeNode) {
                                $("#chosenTableId").val(treeNode.id);
                                $("#chosenTableNm").val(treeNode.name);
                            }
                        }
                    };
                    var zNodesHtml = "";
                    for(var i=0;i<treeList.length;i++){
                        zNodesHtml += ",{id:'"+treeList[i].id+"', pId: '"+treeList[i].pId+"', name: '"+treeList[i].name+"', ";
                        if(treeList[i].id == "1"){
                            zNodesHtml += "open:1,icon:'${ctxStatic}/js/ztree/img/file.png'";
                        }else if(treeList[i].foot == "1"){
                            zNodesHtml += "open:0";
                        }else{
                            zNodesHtml += "open:0,icon:'${ctxStatic}/js/ztree/img/file.png'";
                        }
                        zNodesHtml += "}";
                    }

                    if(zNodesHtml.startsWith(",")){
                        zNodesHtml = zNodesHtml.substr(1,zNodesHtml.length);
                    }

                    zNodesHtml = "[" + zNodesHtml + "]";

                    var zNodes = eval(zNodesHtml);

                    var ztreePool = $.fn.zTree.init($("#treePool"), setting, zNodes);
//                    ztreePool.expandAll(true);
                },error:function(){
                    layer.close(loadingLayer);
                    alert("程序异常");
                }
            });
        }
    }
    /**生成指定选择的模板*/
    function startOne(){
        //获取相关参数
        var outPath = $("#outPath").val();//输出路径
        var author = $("#author").val();//作者
        //表
        var chosenTableId = $("#chosenTableId").val();
        var chosenTableNm = $("#chosenTableNm").val();
        if(!chosenTableId || chosenTableId=="" || chosenTableId.indexOf("T-")!=0){
            alert("没有选择数据库表！");return false;
        }
        var table = chosenTableId.substr(2,chosenTableId.length);
        //模板
        var chosenTreeValue = $("#chosenTreeValue").val();
        if(!chosenTreeValue || chosenTreeValue=="" || chosenTreeValue.indexOf("T")!=0){
            alert("没有选择模板！");return false;
        }
        var templateId = chosenTreeValue.substr(1,chosenTreeValue.length);

        var loadingLayer = layer.load(1, {shade: [0.1,'#fff']});//loading
        $.ajax({
            type: 'post',
            url: '${ctx}/code/codeTemplate/startOne.json?timeStamp='+new Date().getTime(),
            dataType:"json",
            data: {"outPath":outPath,"author":author,"chosenTableNm":chosenTableNm,"table":table,"templateId":templateId},
            success: function (data) {
                layer.close(loadingLayer);
                layer.msg('成功生成');
            },error:function(){
                layer.close(loadingLayer);
                alert("程序异常");
            }
        });
    }

    /**生成项目下所有模板*/
    function startAll(){

    }
</script>
</html>
